<template>
  <div class="goods_new">
    <van-nav-bar title="抵扣记录" left-arrow @click-left="goback"/>
    <van-list
        v-model="loading"
              :finished="finished"
              :immediate-check="false"
              finished-text="没有更多了"
              @load="getNewtList">
      <div class="dikouList" >
      <table v-for="(item, i) in list" :key="i" @click="linkOrder(item.orderId)">
        <tr>
          <td>订单：{{item.orderSn}}</td>
          <td>时间：{{item.addTime}}</td>
        </tr>
        <tr>
          <td style="color:red;">抵扣金额：￥{{item.balance}}</td>
          <td>余额：￥{{item.curBalance}}</td>
        </tr>
      </table>
      </div>
    </van-list>

  </div>
</template>

<script>
import { userGetBalanceRecord } from '@/api/api';
import { Toast, List } from 'vant';
import scrollFixed from '@/mixin/scroll-fixed';

export default {
  mixins: [scrollFixed],

  data() {
    return {
      list: [],
      page: 1,
      limit: 10,
      loading: false,
      finished: false
    };
  },

  mounted () {
    this.init()
  },

  methods: {
    init() {
      this.page = 0;
      this.list = [];
      this.getNewtList();
    },
    getNewtList() {
      this.page++;
      userGetBalanceRecord({
        page: this.page,
        limit: this.limit
      }).then(res => {
        console.log(res)
        this.list.push(...res.data.data.list);
        this.loading = false;
        this.finished = res.data.data.page >= res.data.data.pages;
      });
    },
    linkOrder(item) {
      this.$router.push('/order/order-detail?orderId='+item)
    },
    goback() {
      this.$router.go(-1);
    }
  },

  components: {

    [List.name]: List,
    Toast
  }
};
</script>

<style lang="scss" scoped>
.dikouList {
  background: #fff;
  font-size: 12px;
  table {
    width: 100%;
    border-top: 1px solid #ccc;
    td {
      width: 50%;
      padding: 10px 5px;
    }
  }
}
</style>